<template>
  <div>
    <el-form ref="form" :model="form" :rules="rules" label-width="100px">

      <el-form-item label="系统类型" prop="system">
        <el-radio-group v-model="form.system" v-for="item in systemOptions">
          <el-radio :label="item.dictValue" border style="margin-right: 10px;">{{item.dictLabel}}</el-radio>
        </el-radio-group>
      </el-form-item>


      <el-row>
        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
          <el-form-item label="LOGO" prop="image">
            <UploadImage @change="imageChange" :path="form.logourl"></UploadImage>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
            <div>

            </div>
        </el-col>
      </el-row>


      <el-row>
        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
          <el-form-item label="电话" prop="mobile">
            <el-input v-model="form.mobile" placeholder="请输入电话"/>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
            <el-form-item label="URL" prop="mobile"  v-if="form.system==='2'">
              <el-input v-model="form.url" placeholder="请输入URL"/>
            </el-form-item>
        </el-col>
      </el-row>


      <el-row>
        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
          <el-form-item label="最新版本" prop="newversion">
            <el-input v-model="form.newversion" placeholder="请输入最新版本"/>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
          <el-form-item label="最低版本" prop="minversion">
            <el-input v-model="form.minversion" placeholder="请输入最低版本"/>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
          <el-form-item label="是否强制" prop="isforce">
            <el-radio-group v-model="form.isforce" v-for="item in forceOptions">
              <el-radio :label="item.dictValue" border style="margin-right: 10px;">{{item.dictLabel}}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
          <el-form-item label="客户端" prop="role">
            <el-radio-group v-model="form['checkVersion.role']" v-for="item in roleOptions">
              <el-radio :label="item.dictValue" border style="margin-right: 10px;">{{item.dictLabel}}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
          <el-form-item label="更新提示" prop="tips">
            <el-input v-model="form.tips" type="textarea" :rows="8" maxlength="255" show-word-limit
                      placeholder="请输入更新提示"/>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
          <el-form-item label="备注" prop="remark">
            <el-input v-model="form.remark" type="textarea" :rows="8" maxlength="1000" show-word-limit
                      placeholder="请输入备注"/>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <div slot="footer" class="dialog-footer">
      <div style="margin-left: 100px;">
        <el-button type="primary" :disabled="addLoading" @click.native.prevent="submitForm">
          <span v-if="!addLoading">提 交</span>
          <span v-else>提 交 中...</span>
        </el-button>
      </div>
    </div>

  </div>
</template>

<script>
  import UploadImage from '@/components/UploadImage';

  export default {
    components: {UploadImage},
    props: {
      roleOptions: {
        type: Array,
        require: false
      },
      forceOptions: {
        type: Array,
        require: false
      },
      systemOptions: {
        type: Array,
        require: false
      }
    },
    data() {
      return {
        addLoading: false,
        form: {
          remark: undefined,
          logourl: undefined,
          isforce: '0',
          'checkVersion.role': '1',
          newversion: undefined,
          minversion: undefined,
          mobile: undefined,
          tips: undefined,
          system: '1'
        },
        rules: {}
      }
    },
    created() {

    },
    methods: {
      submitForm() {

      },
      imageChange(message) {
        this.$set(this.form, 'logourl', message);
        this.$refs.form.validateField('logourl');
      }
    }
  }
</script>

<style scoped>

</style>
